<!DOCTYPE html>
<html>
  <head>
  	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=2.0, user-scalable=no, width=device-width">
    <meta charset="utf-8">
    <title>表单列表</title>
    <link rel="stylesheet" type="text/css" href="../css/login.css">
    <script src="https://cdn.bootcss.com/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript" src="../js/vue.js"></script>
    <script type="text/javascript" src="../js/config.js"></script>
    <script type="text/javascript" src="../js/paging.js"></script>
    
    
  </head>
  <body style="background:#fff;">
  	<form id="searchForm">
      <div class="search-bar clearfix panel" style="height: auto;padding-bottom: 0px;">
        <div class="box">
          <div class="cell-search">
            <label>基本信息</label>
            <input type="hidden" name="marketId">

            <select name="shopId">
              <option value="">请选择店铺</option>
              <option v-for="shopItem in shopList" :value="shopItem.shopId">{{shopItem.shopName}}</option>
            </select>
            <label>开票日期</label>
            <input type="date" name="billDate">
          </div>
          <div class="cell-search">
            <label>车辆信息</label>
            <select name="brandId" onchange="getSeriesId(this.value)">
              <option value="">请选择品牌</option>
              <option :value="brandItem.brandId" :id="brandItem.brandId" v-for="brandItem in brandList" >{{brandItem.brandName}}</option>
            </select>
            <select name="seriesId" onchange="getModelId(this.value)">
              <option value="">请选择车系</option>
              <option :value="seriesItem.seriesId" :id="seriesItem.seriesId" v-for="seriesItem in seriesList" >{{seriesItem.seriesName}}</option>
            </select>
            <select name="modelId">
              <option value="">请选择车型</option>
              <option :value="modelItem.modelId" :id="modelItem.modelId" v-for="modelItem in modelList" >{{modelItem.modelName}}</option>
            </select>
          </div> 

          <div class="search-btn-box">
            <button type="button" id="serchBtn">查询</button>
            <a  href="add.html"  class="add-button">新增</a>
          </div>
        </div>
      </div>
    </form>
    <!-- <div style="padding:0 40px;text-align: right;"><a  href="add.html" class="add-button">新增</a></div> -->
    
    <div id="app">
      <table class="list-box">
        <thead>
          <tr>
            <th>序号</th>
            <th>发票开具日期</th>
            <th>发票代码</th>
            <th>发票金额(元)</th>
            <th>车型及号牌</th>
            <th>机动车发动机号</th>
            <th>机动车车架号</th>
            <th>车辆名称</th>
            <th>车辆类型</th>
            <th>转入地车管所</th>
            <th>市场</th>
            <!-- <th>完整度</th> -->
            <th>操作</th>
          </tr>
        </thead>
        
        <tbody>
          <tr v-for="(item,index) in res">
            <td>{{index+1}}</td>
            <td>{{item.billDate | filterSetDate}}</td>
            <td>{{item.billCode}}</td>
            <td>{{item.billPrice}}</td>
            <td>{{item.billCarPlateHead}}{{item.billCarPlateMiddle}}{{item.billCarPlateCode}}</td>
            <td>{{item.billCarEngineNo}}</td>
            <td>{{item.billCarVin}}</td>
            <td>{{item.billCarName}}</td>
            <td>{{item.carType.carTypeName}}</td>
            <td>{{item.billDmv | filterSetBillScore}}</td>
            <td>{{item.market.marketName}}</td>
            <!-- <td>{{item.billScore | filterSetBillScore}}</td> -->
            <td>
              <!-- <a class="over-small"  v-bind:href="'edit.html?billId='+item.billId+'&marketId='+marketId+'&userId='+userId">编辑</a> -->

              <a class="over-small"  v-bind:href="'edit.html?billId='+item.billId+'&marketId='+marketId+'&userId='+userId">编辑</a>
              <a class="over-small"   v-bind:href="'detial.html?billId='+item.billId+'&marketId='+marketId+'&userId='+userId">详情</a>
            </td>
          </tr>
        </tbody>
      </table>
    </div>
    <div id="page" class="page_div">
      
    </div>
    <div class="loading"></div>
    
  </body>
  <script type="text/javascript" src="../js/search.js"></script>
  <script type="text/javascript">
    var numAjax=0;
$(document).ajaxSuccess(function(evt, request, settings){  
    numAjax++;
    if (numAjax>=2) {
      $('.loading').hide()
    }
 }); 
Vue.filter("filterSetDate", function(value) {
  Date.prototype.toLocaleString = function() {
    return this.getFullYear() + "年" + (((this.getMonth()+1) >= 1 && (this.getMonth()+1) <= 9) ? "0" + (this.getMonth()+1):(this.getMonth()+1)) + "月" + ((this.getDate() >= 1 && this.getDate() <= 9) ? "0" + this.getDate():this.getDate()) + "日 ";
  };
  var unixTimestamp = new Date(value) ;
  return unixTimestamp.toLocaleString();
});
Vue.filter("filterSetBillScore", function(value) {
      var strHtml = "";
      if(value){
        strHtml = value
      }else{
        strHtml = '空'
      }
      return strHtml; 
});

  var vm = new Vue({
    el:'#app',
    data: {
      res:[],
      marketId:marketId,
      userId:userId,
    },
    methods: {
 
      },
  });

  var pageIndex=1;
  var pageNumTotal;
  $('.add-button').attr('href', 'add.html?userId='+userId+'&marketId='+marketId)
  $.ajax({
    type: "get",      //data 传送数据类型。post 传递
    dataType: 'json',  // 返回数据的数据类型json
    url: defaultUrl+"/controller/getSaleBillNum",  // yii 控制器/方法
    cache: false,      
    data: {'marketId': marketId},  //传送的数据
    error:function(){
       alert("数据传输错误");
    },success: function (data) {
      console.log(data);
      if (data.code != 1) {
        return false
      }
      var pageTotal = data.result.total;
      pageNumTotal = Math.ceil(pageTotal/20);
      $("#page").paging({
        pageNo:1,
        totalPage: pageNumTotal,
        totalSize: pageTotal,
        callback: function(num) {
          initList(num)
        }
      });
    }
  });
  	function initList(pageIndex){
      $('.loading').show()
  		$.ajax({
	      type: "get",      //data 传送数据类型。post 传递
	      dataType: 'json',  // 返回数据的数据类型json
	      url: defaultUrl+"/controller/getSaleBillList",  // yii 控制器/方法
	      cache: false,      
	      data: {'pageIndex': pageIndex,'pageSize':'20','marketId': marketId},  //传送的数据
	      error:function(){
	         alert("数据传输错误");
	      },success: function (data) {
	      	console.log(data);
	      	if (data.code != 1) {
	         	return false
	        }
          vm.res = data.result;
	      }
      });
  	}
    initList(1);
    $('input[name=marketId]').val(marketId)
    $.get(defaultUrl+"/controller/getShopList?marketId="+marketId,function(res){
      searchForm.shopList = res.result;
    },'json');
  
  	
  </script>
  
</html>


































